<div class="issue-workflow-edit container-fluid">

  <div class="row">
    <div class="edit-toolbar col-xl-12">
      <div class="title">
        <span *ngIf="!model?.id">新建工作流</span>
        <span *ngIf="model?.id">编辑工作流</span>
      </div>
      <div class="buttons">
        <button (click)="back()" workflow="button"
                class="btn btn-secondary btn-with-icon btn-sm back">
          <i class="fa fa-arrow-circle-left"></i>返回
        </button>
      </div>
    </div>
  </div>
  <hr/>

  <form [formGroup]="form" class="my-validate-form">
    <div class="form-group row">
      <label class="col-sm-2 col-form-label"></label>
      <div class="col-sm-10">
        <button (click)="save()" workflow="button" class="btn btn-primary" [disabled]="!form.valid">保存</button>
        &nbsp;
        <button (click)="back()" workflow="button" class="btn btn-default">取消</button>
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        <button (click)="showModal()" *ngIf="model.id && !model.buildIn" workflow="button" class="btn btn-danger">删除</button>
      </div>
    </div>

    <div class="form-group row">
      <label class="col-sm-2 col-form-label"><span>名称</span></label>
      <div class="col-sm-10">
        <input workflow="text" class="form-control" name="name" formControlName="name"
               [(ngModel)]="model.name" #name>
      </div>
    </div>

    <div class="form-group row">
      <label class="col-sm-2 col-form-label"><span>状态</span></label>
      <div class="col-sm-10">
        <div class="checkbox-list">
          <div class="checkbox-list-inner">
            <div class="toolbar">
              <div class="toolbar-inner">
                <span (click)="select('all')" class="link">全选</span> |
                <span (click)="select('none')" class="link">全不选</span>
              </div>
            </div>
            <div>
              <div *ngFor="let item of statuses" class="checkbox-list-item">
                <label>
                  <span class="checkbox-name">{{item.label}}<span></span></span>
                  <input type="checkbox" class="form-check-input"
                         [(ngModel)]="item.selected" formControlName="{{'status-' + item.id}}">
                </label>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>

    <div class="form-group row">
      <label class="col-sm-2 col-form-label"></label>
      <div class="col-sm-10">
        <div class="validate-errors">
          <div class="validate-error" *ngFor="let msg of formErrors">
            <div>{{ msg }}</div>
          </div>
        </div>
      </div>
    </div>

  </form>

</div>

<pop-dialog #modalWrapper (confirm)="delete()" [title]="'提示'">
  确认删除名为"{{model.name}}"的工作流?
</pop-dialog>
